The Embed API is a JavaScript based API for adding embedded content to an external web page or application. This includes the embedding of the Hub application to allow users to self-build their own collage of content.
The API has a native JavaScript version as well as versions that work in React and Angular.
Injectable Code vs Iframe
Unlike alternative embedding solutions, the Pyramid Embed APIs safely and securely INJECT code into the host page. This means the application is running IN the page versus running via an Iframe ON the page. The benefit of this approach is that the embedded solution is far more efficient and scalable as a technique:
- it uses less memory
- is significantly faster
- there can be multiple instances on the same hosting page (with less performance impact)
- it fits the single-page app architectures and design methodologies.
Embed API Structure
The main technique for programming the with the Embed APIs is to instantiate and use the Pyramid Embed client object. The key objects in the Embed API, including the client, are described here.
Then used the instance of the embed client to either embed content directly on the page or embed a hub on the page.
Accessing the Embed API package
There are 2 techniques for accessing the API library file:
Direct Reference
Add a script tag to the host page referencing the JavaScript file (with your specifics changed out):
<script src="http://mysite.com/no-shell/pyramid-embed-js.min.js"></script>
NPM
Inside your development project install the API using the following syntax for NPM:
JavaScript
npm i @pyramid-embed/embed-js
Angular
npm i @pyramid-embed/embed-angular
React
npm i @pyramid-embed/embed-react
Embed API Examples
Click here to see an example of embedding using JavaScript on GitHub.